<!--
 * @Descripttion: Web Project
 * @version: 1.0
 * @Author: Hsu.WenChing
 * @Mail: 2510129345@qq.com
 * @Date: 2020-07-31 09:04:29
 * @LastEditors: Xu.wenqing
 * @LastEditTime: 2020-08-05 15:58:36
--> 
<template>
  <div id="app">
    <ele-header :seller="seller"></ele-header>
    <div class="tab">
      <div class="tab-item">
        <router-link to="/goos">商品</router-link>
      </div>
      <div class="tab-item">
        <router-link to="/ratings">评价</router-link>
      </div>
      <div class="tab-item">
        <router-link to="/seller">商家</router-link>
      </div>
    </div>
    <router-view></router-view>
  </div>
</template>

<script>
import header from "@/components/header/header";
import axios from "axios";
export default {
  name: "App",
  data() {
    return {
      seller: {}
    };
  },
  components: {
    "ele-header": header
  },
  created: function() {
    this.$http.get("/api/seller").then(
      res => {
        res = res.body; //拿到response返回的promise对象的body(Data Object)
        if (res.errno === ERR_OK) {
          this.seller = res.data;
          //console.log(this.seller)
        }
      },
      err => {
        console.log(res);
      }
    );
  }

  // created: function() {
  //   this.$http
  //     .get("/api/seller") //发送get请求，
  //     .then(
  //       function(res) {
  //         //.then方法 请求完成后调用
  //         //第一个函数是请求成功后方法
  //       },
  //       function(err) {
  //         //第二个函数是请求失败后方法
  //       }
  //     );
  // }
};
const ERR_OK = 0;
</script>

<style lang="stylus">
@import './common/stylus/mixins.styl'
#app
  font-family 'Avenir', Helvetica, Arial, sans-serif
  -webkit-font-smoothing antialiased
  -moz-osx-font-smoothing grayscale
  text-align center
  color #2c3e50
  margin-top 60px
.tab
  display flex
  width 100%
  height 40px
  line-height 40px
    border-1px(rgba(7, 17, 27, 0.1))
    .tab-item
      flex 1
      text-align center
      & > a
        display block
        font-size 14px
        color rgb(77, 85, 93)
        &.active
          color rgb(240, 20, 20)
</style>
